<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
	  xmlns:th="http://www.thymeleaf.org">
	<head>
		<meta charset="UTF-8">
		<title>就业工作考核数据分析系统</title>
		<link rel="shortcut icon" th:href="@{/images/favicon.ico}" type="image/x-icon" />
		<link rel="stylesheet" type="text/css" th:href="@{/font-awesome-4.7.0/css/font-awesome.min.css}">
		<link rel="stylesheet" th:href="@{/css/bootstrap.css}" type="text/css">
		<!--<link rel="stylesheet" href="assets/css/magnific-popup.css" type="text/css">-->
		<link rel="stylesheet" th:href="@{/css/style.css}" type="text/css">
		<link rel="stylesheet" type="text/css" th:href="@{/dist/css/txt.wav.css}">
		<link rel="stylesheet" type="text/css" th:href="@{css/index.css}" />
		<link rel="stylesheet" th:href="@{/css/matter.css}" />
		<script>
			var colors = ['255,103,103', '97,223,255', '255,232,88', '141,255,139'];
		</script>
		<script th:inline="javascript">
			var deleteMessages = [[${msg}]];
			if (deleteMessages !== null && deleteMessages !== undefined && deleteMessages !== '') {
				alert(deleteMessages);
			}
		</script>
	</head>

	<body>
		<header>
			<h1>
       <!-- <img th:src="@{/images/top1.png}"/>-->
        <span class="txtwav bounce">就业工作考核数据分析系统</span>
    </h1>
			<ul class="rt_nav">
                <li id="exportyear" style="display: none;">
					<select id="selectyear" style="height:25px;width: 150px;margin: 10px 0;outline: none;border: 0;">
						<option value="">请选择年份</option>
						<option class="selects" th:each="year1:${allYear}" th:value="${year1.getYearName()}" th:text="${year1.getYearName()}"></option>
					</select>
				</li>
				<li id="export" style="color: white;cursor: pointer">
					<i class="fa fa-file-excel-o" style="font-size: 22px"></i><br/>
					<span style="font-size: 12px">导出数据总表</span>
				</li>
                <li class="Template AddClass" style="color: white;cursor: pointer;">
                    <i class="fa fa-download" style="font-size: 22px"></i><br/>
                    <span style="font-size: 12px">模板文档下载</span>
                </li>
				<li style="color: white;cursor: pointer" id="change">
						<i class="fa fa-fire" style="font-size: 22px"></i><br/>
						<span style="font-size: 12px">修改密码</span>
				</li>
				<li>
					<a class="quit_icon" th:href="@{/out}" th:target="_self">
						<i class="fa fa-send"></i>
						<span>安全退出</span>
					</a>
				</li>
			</ul>
		</header>
		<aside class="aside_nav">
			<ul>
				<div class="closeche">
					<i class="fa fa-caret-right"></i>
				</div>
				<li class="active">
					<a th:href="@{/toindex}" th:target="_self">欢迎登录</a>
					<i class="fa fa-angle-double-right"></i>
				</li>
				<li>
					<a th:href="@{/sq/search}">生源质量指数</a>
				</li>
				<li>
					<a th:href="@{/ts/search}">师资结构指数</a>
				</li>
				<li>
					<a th:href="@{/em/search}">就业状态指数</a>
				</li>
				<li>
					<a th:href="@{/employmentRate/findAll}">就业率指数</a>
				</li>
				<li style="white-space : nowrap;">
					<a th:href="@{/es/search}">用人单位满意度指数</a>
				</li>
				<li>
					<a th:href="@{/employmentPractice/findAll}">就业创业实践指数</a>
				</li>
				<li>
					<a th:href="@{/year/to}">年份管理</a>
				</li>
				<li>
					<a th:href="@{/college/to}">学院管理</a>
				</li>
			</ul>
		</aside>
		<section class="wrap">
			<div class="title">
				就业工作考核数据分析系统
				<div style="width: 2px;height:400px;background-color: #283643;transform: rotateZ(70deg);position: absolute;top: -80px;left: -50px;"></div>
				<div style="width: 2px;height:400px;background-color: #283643;transform: rotateZ(-70deg);position: absolute;top: -80px;right: -50px;"></div>
				<div style="width: 2px;height: 280px;background-color: #283643;transform: rotateZ(60deg);position: absolute;top: -19px;left: 34px;"></div>
				<div style="width: 2px;height: 280px;background-color: #283643;transform: rotateZ(-60deg);position: absolute;top: -19px;right: 34px;"></div>
				<div style="width: 2px;height: 178px;background-color: #283643;transform: rotateZ(36deg);position: absolute;top: 33px;left: 111px;"></div>
				<div style="width: 2px;height: 178px;background-color: #283643;transform: rotateZ(-36deg);position: absolute;top: 33px;right:111px;"></div>

				<a  th:href="@{/sq/search}"><div style="width: 40px;height:auto;line-height: 35px;border: solid 2px #283643;color: #283643;position: absolute;top: 210px;left: -260px">生源质量指数</div></a>
				<a th:href="@{/ts/search}"><div style="width: 40px;height:auto;line-height: 35px;border: solid 2px #283643;color: #283643;position: absolute;top: 210px;left: -108px">师资结构指数</div></a>
				<a th:href="@{/em/search}"><div style="width: 40px;height:auto;line-height: 35px;border: solid 2px #283643;color: #283643;position: absolute;top: 210px;left: 42px">就业状态指数</div></a>
				<a th:href="@{/employmentRate/findAll}"><div style="width: 40px;height:auto;line-height: 35px;border: solid 2px #283643;color: #283643;position: absolute;top: 210px;left: 264px">就业率指数</div></a>
				<a th:href="@{/es/search}"><div style="width: 40px;height:auto;line-height: 35px;border: solid 2px #283643;color: #283643;position: absolute;top: 210px;left: 416px">用人单位满意度指数</div></a>
				<a th:href="@{/employmentPractice/findAll}"><div style="width: 40px;height:auto;line-height: 35px;border: solid 2px #283643;color: #283643;position: absolute;top: 210px;left: 568px">就业创业实践指数</div></a>
			</div>
		</section>
		<div class="bgcanvas">
			<div class="content-wrapper">
					<div class="content-main animate">
						<div class="container">
							<h1 class="font-size-90">Welcome</h1>
							<h2 class="opacity-60">就业工作考核数据分析系统</h2>
						</div>
					</div>
					<div class="background-wrapper">
						<canvas id="background-content"></canvas>
					</div>
				</div>
		</div>
		<div class="window">
            <div class="window-center">
                <div class="close-window">×</div>
                <form th:action="@{/update}" th:method="post">
                    <input type="text" name="userId" style="display: none;" th:value="${session.user.getUserId()}">
                    <input type="text" name="userName" style="display: none;" th:value="${session.user.getUserName()}">
                    <input placeholder="请输入原密码" name="old" type="password" style="width: 70%;height: 40px;border: solid 2px white;display: block;margin: 20px auto;color: white;font-size: 15px;margin-top: 60px" required="required">
                    <input placeholder="请输入新密码" id="newpassword" name="password" type="password" style="width: 70%;height: 40px;border: solid 2px white;display: block;margin: 20px auto;color: white;font-size: 15px" required="required">
                    <input placeholder="验证新密码" id="newpassword2" type="password" style="width: 70%;height: 40px;border: solid 2px white;display: block;margin: 20px auto;color: white;font-size: 15px" required="required">
                    <input id="submit" value="提交" type="button" style="text-align:center;width:35%;height: 40px;background-color: white;margin-left: 15%">
                    <input type="reset" style="display: inline-block;width: 35%;height: 40px;background-color: white" />
                </form>
                <p id="tips" style="color: red;margin-left: 15%;margin-top: 10px"> </p>
            </div>
        </div>
        <script>
            window.onload=function () {
				var unDownloadFlag = false;
                $('.Template').click(function (event) {
                	console.log('===')
                	if(unDownloadFlag){
						return false;
					}
						window.location.href='/sq/download';
						unDownloadFlag = true;
						setTimeout(function () {
							unDownloadFlag = false;
						},2000);
                });
                var bool=true;
                $('#export').click(function () {
                    if(bool==true){
                        $('#exportyear').css('display','block');
                        bool=!bool;
                    }else {
                        $('#exportyear').css('display','none');
                        bool=!bool;
                    }
                });
                // 导出数据总表
                $('#selectyear').change(function () {
					var theref='lastExport?year=';
                    var valu=$("#selectyear option:selected").val();
                    if(valu==''){
                    	//alert('年份不能为空！')
					}else{
						theref+=valu;
						window.location.href=theref;
						bool=!bool;
						$('#exportyear').css('display','none');
						$("#selectyear").val('');
						window.open ("e?year="+valu, "newwindow", "height=400, width=800, toolbar =no, menubar=no, scrollbars=no, resizable=no, location=no, status=no")
					}
                });
                document.getElementById("change").onclick=function () {
                    document.getElementsByClassName("window")[0].style.display="block";
                };
                document.getElementsByClassName("close-window")[0].onclick=function () {
                    document.getElementsByClassName("window")[0].style.display="none";
                };
                $("#submit").click(function () {
                    var pass1 = $("#newpassword").val();
                    var pass2 = $("#newpassword2").val();
                    if( pass1 != pass2 ){
                        alert('验证密码不相同')
                    }
                });
                $("#newpassword2").blur(function () {
                    var pass1 = $("#newpassword").val();
                    var pass2 = $("#newpassword2").val();
                    if( pass1 == pass2 ){
                        $("#submit").attr("type","submit");
                    }
                });
            };
        </script>

	</body>
	<script th:src="@{/js/jquery-2.1.0.js}"></script>
	<script type="text/javascript" th:src="@{/js/index.js}" ></script>
	<script type="text/javascript">
		$(function() {
			//确定文档高度
			var winheight = $(window).height();
			winheight -= 70;
			$('.wrap').css('height', winheight);
            //点击缩回
            $('.closeche').on('click',function(){
            	if($('.aside_nav').css('left')=='0px'){
            		$('.aside_nav').css('left','-210px');
            		$('.wrap').css({'width':'95%','margin-left':'40px'});
            	}else{
            		$('.aside_nav').css('left','0px');
            		$('.wrap').css({'width':'','margin-left':'258px'})
            	}
            })
		});
	</script>
	<script th:src="@{/js/bootstrap.min.js}"></script>
	<script th:src="@{/dist/js/txt.wav.min.js}"></script>
	<script th:src="@{/assets/js/TweenLite.min.js}"></script>
	<script th:src="@{/assets/js/EasePack.min.js}"></script>
	<script th:src="@{/assets/js/exploding-triangles.js}"></script>
	<script th:src="@{/assets/js/custom.js}"></script>
	<script>
		var latitude = 34.038405;
		var longitude = -117.946944;
		var markerImage = "assets/img/map-marker.png";
		var mapTheme = "light";
		var mapElement = "map";
		$(".modal").on("shown.bs.modal", function(e) {
			google.maps.event.addDomListener(window, 'load', simpleMap(latitude, longitude, markerImage, mapTheme, mapElement));
		});
	</script>
</html>